<template>
	<view class="goodlist">
		<view class="" v-for="(obj, idx) in listData">
			<view class="header">
				<view class="title">{{ obj.name }}</view>
				<!-- <view class="tag">海外</view> -->
			</view>
			<view class="list">
				<view class="item" v-for="(item, index) in obj.list" :key="item.id" @click="details(item)">
					<divimg class="img" :src="item.image" mode="aspectFill" />
					<view class="rightbox">
						<view class="title clamp">
							{{ item.name }}
						</view>
						<view class="subtitle clamp">
							{{ timeStrGetDate(item.start_time) + '~' + timeStrGetDate(item.end_time) }}
						</view>
						<view class="adderss flex ellipsis">
							<image src="/static/images/adderss.png" class="icon" mode=""></image>
							<text class="txt ellipsis">{{ item.address }}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { timeStrGetDate } from '@/utils/utils.js';
	export default {
		name: 'previousEvents',
		props: {
			listData: {
				type: Array,
				default: () => [],
			},
			type: {
				type: String,
				default: '2',
			},
		},

		data() {
			return {
				arr: [
					{
						img: '',
					},
				],
			};
		},
		methods: {
			details({ id }) {
				
				if(!this.fillInBusinessCard()){
					return
				}
				uni.navigateTo({
					url: '/pages/wbz/details/details?id=' + id + '&type=' + this.type,
				});
			},
			timeStrGetDate: timeStrGetDate,
		},
	};
</script>

<style lang="scss" scoped>
	.header {
		margin: 10rpx auto;
		width: $connet-width;
		display: flex;
		align-items: center;

		.title {
			font-weight: bold;
			color: #000000;
			font-size: $uni-font-size-14;
			margin-right: $submargin-width;
		}

		.tag {
			height: 33rpx;
			background: #1fc28b;
			border-radius: 17rpx 17rpx 17rpx 17rpx;
			opacity: 1;
			font-size: $uni-font-size-10;
			color: #fff;
			padding: 0 10rpx;
			line-height: 33rpx;
		}
	}

	.list {
		margin: 0 auto;
		overflow: hidden;
		.item {
			width: $connet-width;
			margin: $submargin-width auto;
			display: flex;
			background-color: #fff;
			.img {
				width: 330rpx;
				height: 250rpx;
			}
			.rightbox {
				width: 360rpx;
				overflow: hidden;
				position: relative;
				.title {
					width: 300rpx;
					font-size: $uni-font-size-12;
					color: #000000;
					margin: $margin-width auto 10rpx;
				}
				.subtitle {
					width: 300rpx;
					height: auto;
					margin: 0 auto auto;
					color: #999999;
					font-size: $uni-font-size-12;
				}
				.adderss {
					align-items: center;
					width: 300rpx;
					margin: 0 auto;
					position: absolute;
					bottom: 30rpx;
					left: 0;
					right: 0;
					.icon {
						min-width: 26rpx;
						width: 26rpx;
						height: 30rpx;
						margin-right: 10rpx;
					}
					.txt {
						display: inline-block;
						max-width: 280rpx;
						color: $price-color;
						font-size: $uni-font-size-12;
					}
				}
			}
		}
	}
</style>
